<template>
  <table class="table table-striped" width="1100" height="100%" align="center">
    <tbody style="text-align: center">
      <tr>
        <td>
          <a-card :style="{ width: '1100px', textAlign: 'center' }">
            <div id="addNewsView">
              <h2>修改信息</h2>
              <a-form :model="form" label-align="left">
                <a-form-item field="title" label="用户昵称">
                  <a-input v-model="form.userName" placeholder="请输入标题" />
                </a-form-item>
                <a-form-item field="content" label="用户简介">
                  <MdEditor
                    :value="form.userProfile || ''"
                    :handle-change="onContentChange"
                  />
                </a-form-item>
                <a-form-item>
                  <a-button
                    type="primary"
                    style="min-width: 200px"
                    @click="doSubmit"
                    >提交
                  </a-button>
                </a-form-item>
              </a-form>
            </div></a-card
          >
        </td>
      </tr>
    </tbody>
  </table>
</template>

<script setup lang="ts">
import { onMounted, ref } from "vue";
import MdEditor from "@/components/MdEditor.vue";
import { UserControllerService } from "../../../generated";
import message from "@arco-design/web-vue/es/message";
import { useRoute, useRouter } from "vue-router";

let form = ref({
  userName: "",
  userProfile: "",
});
/**
 * 根据题目 id 获取老的数据
 */
const loadData = async () => {
  const res = await UserControllerService.getLoginUserUsingGet();
  if (res.code === 0) {
    form.value.userName = res.data?.userName;
    form.value.userProfile = res.data?.userProfile;
  } else {
    message.error("加载失败，" + res.message);
  }
};

onMounted(() => {
  loadData();
});

const router = useRouter();
const doSubmit = async () => {
  const res = await UserControllerService.updateMyUserUsingPost(form.value);
  if (res.code === 0) {
    message.success("更新成功");
    router.push({
      path: "/user/center",
      replace: true,
    });
  } else {
    message.error("更新失败，" + res.message);
  }
};

const onContentChange = (value: string) => {
  form.value.userProfile = value;
};
</script>

<style scoped>
#addNewsView {
}
</style>
